<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Charlie Puth</title>
</head>
<style>
    body{
        background-color: lightblue;
    }
    ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: rgb(51, 195, 220);
}

li {
  float: left;
}

li a, .dropbtn {
  display: inline-block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

li a:hover, .dropdown:hover .dropbtn {
  background-color: rgb(229, 169, 200);
}

li.dropdown {
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  color: rgb(41, 185, 237);
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

.dropdown-content a:hover {background-color: #f1f1f1;}

.dropdown:hover .dropdown-content {
  display: block;
}
table-back,th{
background-color:rgb(145, 172, 221);
color:bisque;
font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif
        }
        table-back,td{
          background-color:rgb(213, 186, 238);
          color:rgb(227, 154, 193);
        }
        table,td,th{
          border:5px solid rgb(221, 159, 159);
        }
        .table,td,th{
          border-collapse:collapse;
          width:400px;
          height:100px;
        }
        table{
          width:100%;
          border-collapse:collapse;
        }
</style>
<body>
    <ul>
        <li><a href="https://baike.baidu.com/item/%E6%9F%A5%E7%90%86%C2%B7%E6%99%AE%E6%96%AF/17699619">了解一下</a></li>
        <li><a href="https://www.sohu.com/a/253255918_775516">断眉原由</a></li>
        <li class="dropdown">
          <a href="javascript:void(0)" class="dropbtn">近况</a>
          <div class="dropdown-content">
            <a href="https://new.qq.com/rain/a/20211216A05AZ900">新冠之旅</a>
            <a href="https://www.zhihu.com/question/385476706">要糊了咩</a>
          </div>
        </li>
      </ul>
      <table>
        <tr>
          <th>Nine Track Mind</th>
          <th>Voicenotes</th>
        </tr>
        <tr>
          <td>The Way I Am</td>
          <td>See You Again</td>
        </tr>
        <tr>
          <td>Attention</td>
          <td>We Don't Talk Anymore</td>
        </tr>
        </table>
        <img src="C1.jpg">
        <img src="C2.jpg" height="500"width="500">
        <p>查理·普斯(Charlie Puth),1991年12月2日出生于美国新泽西州,美国流行乐男歌手。2011年,查理·普斯将翻唱的歌曲上传至Youtube,由此获得了上百万的点击量 [1]  。2013年10月,发布个人原创专辑《Ego》 [2]  。2015年2月10日,发行与梅根·特瑞娜合作的单曲《Marvin Gaye》 [3]  。3月17日,发行与维兹·卡利法合作的单曲《See You Again》,该单曲在公告牌百强单曲榜获得冠军。2016年1月,发行首张专辑《Nine Track Mind》。2018年5月11日,发行第二张录音室专辑《Voicenotes》。2022年10月7日,发行第三张录音室专辑《CHARLIE》。</p>
        <a href="index.html">回到主页</a>
</body>
</html>